<template>
  <el-dialog v-model="dialogVisible" :title="'查看记录'" @close="dialogVisible = true">
    <ContentWrap>
      <el-table :data="tableData" :stripe="true" :show-overflow-tooltip="true" :loading="loading">
        <el-table-column label="租户Id" prop="tongueTenantId" align="center" />
        <el-table-column label="租户名称" prop="tenantName" align="center" />
        <el-table-column label="额度" prop="tongueQuota" align="center" />
        
        <el-table-column label="过期时间" align="center" prop="expiredTime" :formatter="dateFormatter" width="180" />
        <el-table-column label="操作类型" align="center">
          <template #default="scope">
            {{  filter_operateType[scope.row.operateType]  }}
          </template>
        </el-table-column>
        <el-table-column label="时间" align="center" prop="createTime" :formatter="dateFormatter" width="180" />
      </el-table>
      <Pagination
:total="total" v-model:page="queryParams.pageNo" v-model:limit="queryParams.pageSize"
        @pagination="getList" />
    </ContentWrap>
  </el-dialog>
</template>

<script setup lang="ts">
import { ref, toRefs, reactive } from 'vue'
import { dateFormatter } from '@/utils/formatTime'
import { TongueTenantApi } from '@/api/application/tongue/leaseholder'
const dialogVisible = ref(false)
const state = reactive({
  loading: false,
  tableData: [],
  total: 0,
  queryParams: {
    tongueTenantId: '',
    pageNo: 1,
    pageSize: 10
  },
})
const { queryParams, loading, tableData, total } = toRefs(state)
const filter_operateType:any = {
  1:'新增',
  2:'编辑',
}
const getList = async () => {
  loading.value = true
  const data = await TongueTenantApi.getTenantRecordPage(queryParams.value)
  tableData.value = data.list
  total.value = data.total
  loading.value = false
}
const open = async (data?: any) => {
  dialogVisible.value = true
  queryParams.value.tongueTenantId = data.tongueTenantId
  getList()
}
defineExpose({ open })
</script>

<style scoped lang="scss"></style>